// 默认的echart配置

import noDataIcon from '@/assets/icons/png/nodata.png';

export function cockpitChartStyle() {
	return {
		// 基础
		common: {
			// 全局字体样式
			textStyle: {
				color: '#ffffff',
			},
			// 调色盘
			color: ['#2beded', '#1875f0', '#ff9a0c', '#fe5578', '#ff7d4f'],
		},
		// 图例统一样式
		legendStyle: {
			itemWidth: 40,
			itemGap: 20,
			textStyle: {
				color: '#ffffff',
			},
		},
		// X轴统一样式
		xAxisStyle: {
			// X坐标轴样式
			axisLine: {
				lineStyle: {
					color: '#ffffff',
				},
			},
			// X轴刻度样式
			axisTick: {
				show: false,
			},
		},
		// Y轴统一样式
		yAxisStyle: {
			// Y坐标轴样式
			axisLine: {
				show: true,
				lineStyle: {
					color: '#fff',
				},
			},
			// Y轴刻度样式
			axisTick: {
				show: false,
			},
			// 分隔线样式
			splitLine: {
				show: false,
				lineStyle: {
					opacity: 0.2,
				},
			},
			// 最小间隔(保证整数)
			minInterval: 1,
		},
		// 坐标系位置
		grid: {
			x: 60,
			x2: 40,
			y: 30,
			y2: 40,
		},
		// 无数据时统一样式
		noDataOption: {
			title: {
				text: '暂无数据',
				x: 'center',
				y: 'center',
				textStyle: {
					color: '#ffffff70',
				},
			},
		},
	};
}

export function indexChartStyle() {
	return {
		// 基础
		common: {
			// 全局字体样式
			textStyle: {
				color: '#ffffff',
			},
			// 调色盘
			color: ['#33ffff', '#fb3a5f', '#1cd1a1', '#ff9a0c'],
		},
		// 标题统一样式
		titleStyle: {
			// 主标题
			textStyle: {
				color: '#ffffff',
			},
			// 副标题
			subtextStyle: {
				color: '#ffffff',
			},
			// 主副标题间距
			itemGap: 10,
			left: 80,
			top: 20,
		},
		// 图例统一样式
		legendStyle: {
			itemWidth: 20,
			itemGap: 10,
			top: 20,
			left: '35%',
			icon: 'roundRect',
			textStyle: {
				color: '#ffffff',
			},
		},
		// X轴统一样式
		xAxisStyle: {
			boundaryGap: false,
			// X坐标轴样式
			axisLine: {
				lineStyle: {
					color: '#ffffff',
				},
			},
			// grid分隔线
			splitLine: {
				show: false,
			},
			// Y轴刻度样式
			axisTick: {
				show: false,
			},
		},
		// Y轴统一样式
		yAxisStyle: {
			// Y坐标轴样式
			axisLine: {
				lineStyle: {
					color: '#ffffff',
				},
			},
			// grid分隔线
			splitLine: {
				show: false,
			},
			// 刻度
			axisTick: {
				show: false,
			},
			// 最小间隔(保证整数)
			minInterval: 1,
		},
		// 坐标系位置
		grid: {
			x: 80,
			x2: 40,
			y: 80,
			y2: 20,
		},
		// 无数据时统一样式
		noDataOption: {
			title: {
				text: '暂无数据',
				x: 'center',
				y: 'center',
				textStyle: {
					color: '#ffffff70',
				},
			},
		},
	};
}

/**
 * 系统监控图表统一样式
 */
export function systemMonitorChartStyle() {
	return {
		// 基础
		common: {
			// 全局字体样式
			textStyle: {
				color: '#ffffff',
			},
			// 调色盘
			color: ['#ff9a0c', '#00ffff', '#6d51f5', '#fe5578', '#ff7d4f'],
		},
		// X轴统一样式
		xAxisStyle: {
			boundaryGap: false,
			axisLine: {
				lineStyle: {
					color: '#ffffff',
				},
			},
			axisTick: {
				show: false,
			},
		},
		// Y轴统一样式
		yAxisStyle: {
			axisLine: {
				show: true,
				lineStyle: {
					color: '#ffffff',
				},
			},
			axisTick: {
				show: false,
			},
			splitLine: {
				show: false,
			},
			// 最小间隔(保证整数)
			minInterval: 1,
		},
		// 图例统一样式
		legendStyle: {
			itemWidth: 40,
			itemGap: 20,
			textStyle: {
				color: '#ffffff',
			},
		},
		// 坐标系位置
		grid: {
			x: 60,
			x2: 40,
			y: 30,
			y2: 40,
		},
		// 无数据时统一样式
		noDataOption: {
			title: {
				text: '暂无数据',
				x: 'center',
				y: 'center',
				textStyle: {
					color: '#ffffff70',
				},
			},
		},
	};
}

/** 格式化坐标轴文本 */
export function axisFormat1024(value: any, decimal: any) {
	if (value / 1024 / 1024 / 1024 >= 10) {
		return (value / 1024 / 1024 / 1024).toFixed(decimal || 0) + ' G';
	} else if (value / 1024 / 1024 >= 10) {
		return (value / 1024 / 1024).toFixed(decimal || 0) + ' M';
	} else if (value / 1024 >= 10) {
		return (value / 1024).toFixed(decimal || 0) + ' K';
	} else {
		return value;
	}
}

export function axisFormat1000(value: any, decimal: any) {
	if (value / 1000 / 1000 / 1000 >= 10) {
		return (value / 1000 / 1000 / 1000).toFixed(decimal || 0) + ' G';
	} else if (value / 1000 / 1000 >= 10) {
		return (value / 1000 / 1000).toFixed(decimal || 0) + ' M';
	} else if (value / 1000 >= 10) {
		return (value / 1000).toFixed(decimal || 0) + ' K';
	} else {
		return value;
	}
}

export function axisFormatTime(value: any, wmFlag: any) {
	if (value === null || value === undefined) {
		return value;
	}
	if (wmFlag) {
		value = value / 1000;
	}
	if (value / 60 / 60 / 1000 >= 10) {
		return (value / 60 / 60 / 1000).toFixed(0) + ' 时';
	} else if (value / 60 / 1000 >= 10) {
		return (value / 60 / 1000).toFixed(0) + ' 分';
	} else if (value / 1000 >= 10) {
		return (value / 1000).toFixed(0) + ' 秒';
	} else {
		if (wmFlag) {
			value = value * 1000;
			if (value / 1000 >= 10) {
				return (value / 1000).toFixed(0) + '毫秒';
			}
			return value + '微秒';
		} else {
			return value + '毫秒';
		}
	}
}
// 没有数据
export function noDataOption(myChart: any, title: Record<string, any>) {
	const icon = noDataIcon;
	const msgOption: Record<string, any> = {
		series: [
			{
				type: 'scatter',
				data: [[0, 0]],
				symbolSize: 1,
				label: {
					normal: {
						show: true,
						formatter: title.textStyle.formatter ? '{icon|} ' + title.textStyle.formatter : '{icon|} 暂无数据~',
						borderRadius: 5,
						padding: 10,
						color: '#909399',
						fontSize: 14,
						shadowBlur: 3,
						lineHeight: 30,
						rich: {
							icon: {
								height: 14,
								align: 'center',
								backgroundColor: {
									image: icon,
								},
							},
						},
					},
				},
			},
		],
		xAxis: {
			axisLabel: { show: false },
			axisLine: { show: false },
			splitLine: { show: false },
			axisTick: { show: false },
			min: -1,
			max: 1,
		},
		yAxis: {
			axisLabel: { show: false },
			axisLine: { show: false },
			splitLine: { show: false },
			axisTick: { show: false },
			min: -1,
			max: 1,
		},
	};
	if (title) {
		msgOption.title = title;
	}
	myChart?.clear();
	myChart?.hideLoading();
	myChart?.setOption(msgOption);
}
